<template>
  <edit-dialog :centerDialogVisible="visible" tilte="添加人员" @Cancel="handleCancel" @Submit="handleSubmit"
    :width="dialogWidth">
    <template #content>
      <el-transfer v-model="selectNodes" :data="data" filterable :props="{key: 'staffId',label: 'name',}"
                   :filter-method="filterMethod" :titles="['待选区', '已选区']"
      />
<!--      <CustomTransfer v-model="selectNodes" :data="data" @change="changeValue" />-->
    </template>
  </edit-dialog>
</template>
<script lang="ts" setup>
import { ref, reactive, defineProps, watch, nextTick, toRaw, computed } from 'vue'
import { useStore } from 'vuex'
import editDialog from '@/components/editDialog/index.vue'
import { ElMessage } from 'element-plus'
import CustomTransfer from './customTransfer.vue'
import {repCompanyDistribute } from '@/api/rep/company'
import {getUserListAllByScheduleGroup, getUsersByorganId, scheduleGroupUpdate} from "@/api/quality/scheduleGroup";

interface Option {
  id: number
  key: number
  label: string
  disabled: boolean
}
interface listType {
  id: string,
  label: string,
  isMember?: boolean,
  children?: any[]
}
const props = defineProps({
  visible: {
    type: Boolean,
    default: false,
  }, selectId: {
    type: String,
    default: '',
  },
  info: {
    type: Object,
    default: () => null,
  },
})

const emit = defineEmits(['cancel', 'ok'])

const store = useStore()
// 弹窗标题
const dialogWidth = ref('610px')
const userInfo = computed(() => store.state.user.userInfo)
const filterMethod = (query, item) => {
  return item.name.toLowerCase().includes(query.toLowerCase())
}

const data = ref<Option[]>([])
const selectNodes = ref<listType[]>([])

const changeValue = (value: listType[]) => {
  selectNodes.value = value;
}

const handleSubmit = async () => {
  // let array: any[] = [];
  //   selectNodes.value.forEach(item=>{
  //   array.push(item.staffId)
  // })
  if(selectNodes.value.length==0){
    ElMessage.success('请选择人员')
    return
  }
  const res = await scheduleGroupUpdate({
    id:props.info.id,
    employeeIds:selectNodes.value.join(',')
  });
  if (res?.code === '1') {
    ElMessage.success('添加人员成功')
    emit('ok',selectNodes.value)
    selectNodes.value=[]

  } else {
    ElMessage.error(res?.message || '添加人员失败')
  }
}

const handleCancel = () => {
  emit('cancel')
}

const getCompanyShuttle = async () => {
  const res = await getUsersByorganId( {
    createDept:props.info.createDept,
    groupId:props.info.id
  });

  data.value = res.data || [];
  console.log(data.value)

  const result=await getUserListAllByScheduleGroup({
    condition: {
      groupId: props.info.id
    }

  })
  const list: any[]=[]
  selectNodes.value=[]
  if(result.code=='1'&&result.data!=null&&result.data.length>0){
    data.value=data.value.concat(result.data)
    result.data.forEach((item: { staffId: any; })=>{

          list.push(item.staffId)
    })
    //默认选中
    selectNodes.value=list
  }

}





watch(() => props.visible, (val, oldVal) => {
  if (val) getCompanyShuttle()
  if (val && val !== oldVal) {
    nextTick(() => {
      if (props.info) {
        const info = toRaw(props.info);
      } else {
      }
    })
  }
})
</script>
